<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>测试跨域</title>
    <script src="https://cdn.staticfile.net/jquery/3.7.1/jquery.min.js"></script>
  </head>
  <body>
    <button id="btnGet">get</button>
    <button id="btnPost">post</button>
    <button id="btnDelete">delete</button>
    <script>
      $(function () {
        $('#btnGet').on('click', function () {
          $.ajax({
            type: 'get',
            url: 'http://127.0.0.1/api/user/list',
            data: {
              name: '张三',
              age: 29,
            },
            success: (res) => {
              console.log(res)
            },
          })
        })

        $('#btnPost').on('click', function () {
          $.ajax({
            type: 'post',
            url: 'http://127.0.0.1/api/user/add',
            data: {
              name: '里斯本',
              age: 29,
            },
            success: (res) => {
              console.log(res)
            },
          })
        })

        $('#btnDelete').on('click', function () {
          $.ajax({
            type: 'delete',
            url: 'http://127.0.0.1/api/user/delete',
            success: (res) => {
              console.log(res)
            },
          })
        })
      })
    </script>
  </body>
</html>
